LINEのLIFFアプリをホーム画面に置く！iOSの「ショートカット」機能でURL Schemeをホームアイコン化する

LINEのLIFFアプリを利用しやすくする

LINEプラットフォームには LIFF（LINE Front-end Framework） と呼ばれる、LINE上でWebアプリケーションを実行する仕組みがあります。

• LINE Front-end Frameworkの概要

LINEユーザーを対象にしたWebアプリを提供できるので非常に便利な機能です。そのLIFFアプリへのアクセス方法は URL Schemeを使う 形を取ります。

このURL Schemeをどこに配置し、どのように使い始めてもらうか考える必要があります。例えば、よくある作戦は以下の通りです。

• LINE公式アカウントのリッチメニューに貼る
• Webページにリンクを貼る
• 二次元コード（QRコード）を作り、任意の場所でカメラから起動してもらう

一方、iOSの世界では iOS 13から「ショートカット」という機能が標準搭載されました。 ショートカットアプリは以前からありましたが、iOS 13からは標準搭載されたため、基本的には誰でも標準機能として使うことができるようになりました。ショートカットを使うハードルが下がったということです。

ショートカット機能では様々なアクションを定義することが可能ですが、その一つに「アクションをホームに追加する」というものがあります。

これらを組み合わせて LIFFアプリが起動するホームアイコン を作ってみました。

最終成果物はこちら

弊社が運営する次世代カフェ「Developers.IO CAFE」は、スマホからモバイルオーダーやウォークスルーが行える形になっており、今週 LIFFアプリ版を公開しました。

Developers.IO CAFEの公式アカウントから起動できる方式の他に、ホームから立ち上げたくショートカット機能を使って実現してみました。

手順

まずショートカットアプリを起動します。

「ショートカットを作成」をタップします。

「アクションを追加」をタップします。

アクションの種類、または提案が表示されています。「Web」をタップします。

検索やリーディングリストへの追加など、Webを利用したアクションが一覧で表示されます。「Webページを表示」をタップします。

URLを設定します。 ここでURL Schemeを入力します。

今回の場合はLIFFを起動したいため、LIFFのURLを入力します。ちなみにDevelopers.IO CAFEのドリンクメニューを開くには以下を登録します。

line://app/1560724402-xgYl7rgq?redirect=menu

ショートカット名を設定します。ここで注釈が書かれているのでお分かりになるかと思いますが Siriからも呼び出せるようになります。

アイコンをタップすると、アイコンのグラフィック・背景を設定できます。残念ながら、独自の画像は設定できません。

これでショートカットは作成できました。これをホームに追加します。「…」をタップします。

ショートカットのアクションリストが表示されるので「…」をタップします。

ショートカットの詳細です。「ホーム画面に追加」をタップします。

内容を確認し「追加」をタップします。

以上で、ホーム画面にアイコンを作成できました。

起動すると以下のようになります。

ホーム画面からURL Schemeを起動させたい場合のデファクトスタンダードになるかもしれない？

ちなみに、以前までもURL Schemeをホーム画面に置くことが可能でした。それはData URLを駆使して、ホームにWebページを置くという方法です。ですが、こちらの方法はiOS 13では 一度立ち上がった後に再度開こうとすると起動しない という問題が発生しており、いまのところ実用的ではありません。

ショートカット機能はアイコンに自由な画像を設定できないという課題はあるものの、非常に実用的ですので皆さんもぜひ使ってみてください！